﻿@charset('UTF-8');
html,body {
	scrollbar-face-color:#F0F0F0;
	font-family: Arial, Helvetica, Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3",sans-serif;
}

pre.mml{
	font-family:'Courier New',monospace;
	font-size:12px;
	width: auto;				/*100%にすると横スクロールバー出現*/
	line-break:strict;			/*IE対策*/
	word-break:break-all;		/*IE対策*/
	word-wrap:break-word;		/*IE対策*/
	white-space:-moz-pre-wrap;	/*Mozilla対策*/
	white-space:-pre-wrap;		/*Opera対策*/
	white-space: -o-pre-wrap;	/*Opera7対策*/ 
	white-space: pre-wrap;		/*？*/
	text-decolation:none;
	text-color:black;
	line-height:12px;
	padding:0.5em;
}

/* Marking Up MabinogiMML */
/* .mml span { white-space: nowrap; }	*/
.mml .ext { font-weight:bold; }
.mml .tempo { color: blue; }
.mml .length { color:darkorange; }
.mml .length2 { color:grey; }
.mml .octave { color:maroon; }
.mml .octave2{ color:navy; font-weight:bolder;}
.mml .volume { color:red; }
.mml .rest {color:purple;}
.mml .note {color:mediumpurple;}
.mml .chromatic { color:steelblue;}
.mml .tie { color:seagreen;}
.mml .dotted { color:silver;}


textarea {
	overflow:-moz-scrollbars-vertical;
}

.title_toolbar{
	margin-right: 10px;
	margin-left: 5px;
}
ul.navi {
	margin:0px;
	padding:0px;
	text-align:center;
	list-style-type: none;
}
li.navi_none {
	display:inline;
	float:none;
}
li.navi_left {
	display:inline;
	float:left;
	text-align:left;
}
li.navi_right {
	display:inline;
	float:right;
	text-align:right;
}

#contents .info{
	text-align:right;
	font-size:10px;
	margin-right:2em;
}

#contents #extra{
	margin-left:2em;
	margin-right:2em;
	font-size:12px;
}

#contents #mml_tabs{
	margin-left:1em;
	margin-right:1em;
	height: 300px;
}

#contents #lyrics{
	margin-left:1em;
	margin-right:1em;
}

#contents #media{
	margin-right: 30px;
	margin-left: 30px;
}

hr{
	border-style: solid none none none;
	border-top-width: 1px;
	border-top-color: #EAEAEA;
	height: 1px;
	margin-left:1em;
	margin-right:1em;
}

form {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-right: 10px;
	margin-left: 10px;
	padding-right: 10px;
	padding-left: 10px;
	margin-top: 10px;
	margin-bottom: 10px;
}

.mmls {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-right: 10px;
	margin-left: 10px;
	margin-top: 10px;
	margin-bottom: 10px;
}

.mml_post {
	border:#dedede 1px solid;
}

input, textarea, select, div[contentEditable="true"] {
	font-size:12px;
}

input:hover,select:hover,textarea:hover	{
	background-color: #FFFFCC;
}

input:focus,select:focus,textarea:focus	{
	background-color: #CCFFFF;
}

input:active,select:active,textarea:active	{
	background-color: #FFCCFF;
}

/* add padding to each contentpane inside the tab container, and scrollbar if necessary */
.dojoTabPane {
	padding : 10px 10px 10px 10px;
	overflow: auto;
}

/* hatena Star */
.hatena-star-star-image {
  background-image: url('/img/icons/16x16/bookmark.png');
}

.hatena-star-add-button-image {
  background-image: url('/img/icons/16x16/bookmark_add.png');
}

.hatena-star-comment-button-image {
  background-image: url('/img/icons/16x16/comment.png');
}

/* composer */
#composer-controler{
	margin:10px;
	width:580px;
}

#composer-keyboard{
	float:left;
	position:relative;
	z-index:999;
	width:263px;
	height:123px;
	background:url(http://static.nexon.co.jp/mabinogi/6th_img/library/img_composer_keyboard.gif) no-repeat left top;
}
#composer-keyboard a{
	display:block;
	cursor:pointer;
	position:absolute;
}

#c {width:33px;height:108px;top:4px;left:2px ; z-index:1000;}
#cs{width:24px;height:71px; top:0px;left:25px; z-index:1007;}
#d {width:33px;height:108px;top:4px;left:39px; z-index:1001;}
#ds{width:24px;height:71px; top:0px;left:63px; z-index:1008;}
#e {width:33px;height:108px;top:4px;left:77px; z-index:1002;}
#f {width:33px;height:108px;top:4px;left:114px;z-index:1003;}
#fs{width:24px;height:71px; top:0px;left:138px;z-index:1009;}
#g {width:33px;height:108px;top:4px;left:151px;z-index:1004;}
#gs{width:24px;height:71px; top:0px;left:175px;z-index:1010;}
#a {width:33px;height:108px;top:4px;left:189px;z-index:1005;}
#as{width:24px;height:71px; top:0px;left:213px;z-index:1011;}
#b {width:33px;height:108px;top:4px;left:226px;z-index:1006;}

#composer-setup{
/*	float:right;	*/
}

.composer-setup-item{
	width:53px;
	padding:0;
}

#composer-display{
	clear:both;
}
.composer-display-item{
	width:30%;
	padding:5px;
	ime-mode:disabled;
	float:left;
}
.composer-display-item textarea{
	width:100%;
	height:200px;
}

.composer-display-length{
	float:right;
}
.composer-display-radio{
	float:left;
}
.composer-display-length input{
	width:32px;
}

/* Icon Button */
.icon {
	border:1px solid #dedede;
	border-bottom:1px solid #dedede;

	border-right:1px solid #dedede;
	margin:1px;
	background:#fff;
	width:20px;
	height:20px;
	cursor:hand;
	background-repeat: no-repeat;
	background-position: center center;
	color:transparent;
	font-size:0px;
}
.icon:hover{
	background-color: #FFFFCC;
}

.dijitDisabled .icon { filter: alpha(opacity=50); }

#ApplyVolume, #ApplyTempo
	{ background-image:url('/img/icons/16x16/key_enter.png'); }

/* Note Length Button */
#note_1	{ background-image:url('/img/composer/1.png'); }
#note_2	{ background-image:url('/img/composer/2.png'); }
#note_4	{ background-image:url('/img/composer/4.png'); }
#note_8	{ background-image:url('/img/composer/8.png'); }
#note_16	{ background-image:url('/img/composer/16.png'); }
#note_32	{ background-image:url('/img/composer/32.png'); }
#note_64	{ background-image:url('/img/composer/64.png'); }
#note_3	{ background-image:url('/img/composer/3.png'); }
#note_6	{ background-image:url('/img/composer/6.png'); }
#note_12	{ background-image:url('/img/composer/12.png'); }
#note_24	{ background-image:url('/img/composer/24.png'); }

#tie	{ 
	background-image:url('/img/composer/tie.png');
	background-color:#EEFFEE;
	border-color:#CCFFCC;
}

/* Rest Button */
#rest_1	{ background-image:url('/img/composer/r1.png'); }
#rest_2	{ background-image:url('/img/composer/r2.png'); }
#rest_4	{ background-image:url('/img/composer/r4.png'); }
#rest_8	{ background-image:url('/img/composer/r8.png'); }
#rest_16	{ background-image:url('/img/composer/r16.png'); }
#rest_32	{ background-image:url('/img/composer/r32.png'); }
#rest_64	{ background-image:url('/img/composer/r64.png'); }

#tone_checker	{ background-image:url('/img/icons/16x16/spellcheck.png'); }

/* Button Icon Set (for iconclass atribute use) */
/* example: <div dojotype="dijit.form.button" iconclass="LoreleiIcon LoreleiIconOK">OK</div> */
.LoreleiIcon {
	background-repeat: no-repeat;
	background-position: center center;
	width: 18px;
	height: 18px;
}

.LoreleiIconButton {
	margin:0px;
	padding:0px;
	width:16px;
	height:16px;
	cursor:hand;
}

.dijitDisabled .LoreleiIconButton { filter: alpha(opacity=50); }

.LoreleiIconOk			{ background-image: url('/img/icons/16x16/ok.png'); }
.LoreleiIconCancel		{ background-image: url('/img/icons/16x16/cancel.png'); }
.LoreleiIconReset		{ background-image: url('/img/icons/16x16/reload.png'); }
.LoreleiIconSave		{ background-image: url('/img/icons/16x16/filesave.png'); }
.LoreleiIconAdd			{ background-image: url('/img/icons/16x16/edit_add.png'); }
.LoreleiIconEdit		{ background-image: url('/img/icons/16x16/edit.png'); }
.LoreleiIconDelete		{ background-image: url('/img/icons/16x16/delete.png'); }
.LoreleiIconRemove		{ background-image: url('/img/icons/16x16/edit_remove.png'); }
.LoreleiIconClear		{ background-image: url('/img/icons/16x16/editclear.png'); }
.LoreleiIconFind		{ background-image: url('/img/icons/16x16/find.png'); }
.LoreleiIconAddComment	{ background-image: url('/img/icons/16x16/comment.png'); }
.LoreleiIconDeleteComment	{ background-image: url('/img/icons/16x16/removecomment.png'); }
.LoreleiIconSearch		{ background-image: url('/img/icons/16x16/search.png'); }

.LoreleiIconMmlAdd		{ background-image: url('/img/icons/16x16/tab_new.png'); }
.LoreleiIconMmlEdit		{ background-image: url('/img/icons/16x16/tab.png'); }
.LoreleiIconMmlDelete	{ background-image: url('/img/icons/16x16/tab_remove.png'); }
.LoreleiIconMmlPlay		{ background-image: url('/img/icons/16x16/playsound.png'); }
.LoreleiIconMmlCopy		{ background-image: url('/img/icons/16x16/editcopy.png'); }
.LoreleiIconMmlPaste	{ background-image: url('/img/icons/16x16/editpaste.png'); }

.LoreleiIconPlay		{ background-image: url('/img/icons/16x16/mix_treble.png'); }
.LoreleiIconPlayMidi	{ background-image: url('/img/icons/16x16/kmid.png'); }
.LoreleiIconPlayFlmml	{ background-image: url('/img/icons/16x16/kcmpci.png'); }

.LoreleiIconExport		{ background-image: url('/img/icons/16x16/fileexport.png'); }
.LoreleiIconExportMms	{ background-image: url('/img/icons/16x16/mmseq.png'); }
.LoreleiIconExportMle	{ background-image: url('/img/icons/16x16/mle.png'); }
.LoreleiIconExportTms	{ background-image: url('/img/icons/16x16/sakura.png'); }

.LoreleiIconManage		{ background-image: url('/img/icons/16x16/configure.png'); }
.LoreleiIconManageEdit	{ background-image: url('/img/icons/16x16/edit.png'); }
.LoreleiIconManageDelete	{ background-image: url('/img/icons/16x16/edittrash.png'); }

.LoreleiIconPlayerPlay	{ background-image: url('/img/icons/16x16/player_play.png'); }
.LoreleiIconPlayerStop	{ background-image: url('/img/icons/16x16/player_stop.png'); }
.LoreleiIconPlayerPause	{ background-image: url('/img/icons/16x16/player_pause.png'); }
.LoreleiIconPlayerChange	{ background-image: url('/img/icons/16x16/artsmidimanager.png'); }
